<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portfolio</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
        integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
    <link rel="stylesheet" href="./assets/css/reset.css">
    <link rel="stylesheet" href="./assets/css/animate.min.css">
    <link rel="stylesheet/less" href="./assets/css/index2.less">
    <link rel="stylesheet/less" href="./assets/css/comment.less">
</head>

<body>
    <nav class="navbar navbar-default">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>

                <a class="navbar-brand wow fadeInUp" href="#">
                    <div class="r"></div>
                    <div class="z"></div>
                    Your Logo
                </a>
                <div class="search"><input type="checkbox" name="in" id="im1">
                    <label for="im1" class="image"><img src="./assets/img/1/Vector Smart Object 3.png" alt=""><input
                            type="text"></label>
                    </li>
                </div>

            </div>


            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1" style="overflow:hidden ;">


                <ul class="nav navbar-nav navbar-right" style="
        text-transform:capitalize;
                text-align: center;
                font-size: 15px;">
                    <li class="home wow fadeInUp" data-wow-delay=".1s"><a href="./index.html">Home</a></li>
                    <li class="Portfolio wow fadeInUp" data-wow-delay=".2s"><a href="./2.html">Portfolio</a></li>
                    <li class="wow fadeInUp" data-wow-delay=".3s"><a href="./3.html">About</a></li>
                    <li class="wow fadeInUp" data-wow-delay=".4s"><a href="./4.html">Contact</a></li>
                    <li class="blog wow fadeInUp" data-wow-delay=".5s"><a href="#">Blog</a></li>
                    </li>
                    <li class="search wow fadeInUp" data-wow-delay=".6s">
                        serarch
                        <input type="checkbox" name="in1" id="im">
                        <label for="im" class="image"><img src="./assets/img/1/Vector Smart Object 3.png" alt=""><input
                                type="text"></label>

                    </li>
                </ul>

            </div>
        </div>
        </div>
    </nav>
    <!-- good -->
    <div class="good">
        <div class="slider">
            <div class="title wow fadeInUp" data-wow-delay=".2s">
                PORTFOLIO
            </div>
        </div>
    </div>
    <!-- we -->
    <div class="we">
        <div class="title wow fadeInLeft" data-wow-delay=".2s">
            who are we?
        </div>
        <div class="con1 wow fadeInLeft" data-wow-delay=".3s">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc a faucibus elit. Nulla facilisi. Ut eu erat
            metus. Nulla diam venenatis at scelerisque et, mattis quis mi. Maurisac consequat velit. Nullam eget massa
            vitae sem ullamcorper conse quat. In bibendum orci quis magna facilisis cursus. Maecenas rutrum felis vel
            nibh ultrices quis tincidunt ipsum dolor sit amet dniof ortigonta alamond druntilortu.

        </div>
        <div class="con2 wow fadeInLeft" data-wow-delay=".4s">
            Sed lobortis, dui ac bibendum fringilla, massa augue mattis enim, quis volutpat augue nisi vitae nibh. Proin
            nibh tortor, rutrum luctus euismod eu, rutrum eget nunc. Nam commodo tellus quis ante tempus quis auctor
            enim suscipit. Donec sit amet feugiat justo. Nulla vel nibh et erat consequat sollicitudin. Vivamus egestas
            erat ac arcu sagittis in tincidunt purus pharetra. Maecenas viverra suscipit arcu, ac adipiscing odio
            vehicula nec.
            Vestibulum non enim ac dui interdum tempus nam tortor odio.
        </div>
        <div class="de wow fadeInLeft" data-wow-delay=".5s">
            we belive in good design
        </div>
        <div class="fg">

        </div>
        <div class="app wow fadeInLeft" data-wow-delay=".6s">
            <div class="list">
                <img src="./assets/img/2/Vector Smart Object 8.png" alt="">
                <div class="ti">
                    Web Design
                </div>
                <div class="des">
                    Lorem ipsum dolor sit ametconsec tetur adipiscing elit. Aliquam nulla nibh, fermentum nec interdum in, ultrices eget sapien. Ut sit amet vehicula risus. Nulla sed erat eu nisl porta bibendum. Sed tellus felis. 
                </div>
            </div>
            <div class="list">
                <img src="./assets/img/2/Vector Smart Object 7.png" alt="">
                <div class="ti">
                    Phone App
                </div>
                <div class="des">
                    Lorem ipsum dolor sit ametconsec tetur adipiscing elit. Aliquam nulla nibh, fermentum nec interdum in, ultrices eget sapien. Ut sit amet vehicula risus. Nulla sed erat eu nisl porta bibendum. Sed tellus felis. 
                </div>
            </div>
            <div class="list">
                <img src="./assets/img/2/Vector Smart Object 6.png" alt="">
                <div class="ti">
                    Commercial
                </div>
                <div class="des">
                    Lorem ipsum dolor sit ametconsec tetur adipiscing elit. Aliquam nulla nibh, fermentum nec interdum in, ultrices eget sapien. Ut sit amet vehicula risus. Nulla sed erat eu nisl porta bibendum. Sed tellus felis. 
                </div>
            </div>
            <div class="list">
                <img src="./assets/img/2/Vector Smart Object 5.png" alt="">
                <div class="ti">
                    Media Planing
                </div>
                <div class="des">
                    Lorem ipsum dolor sit ametconsec tetur adipiscing elit. Aliquam nulla nibh, fermentum nec interdum in, ultrices eget sapien. Ut sit amet vehicula risus. Nulla sed erat eu nisl porta bibendum. Sed tellus felis. 
                </div>
            </div>
        </div>
        <div class="fg1">

        </div>
    </div>

    <!-- team -->
    <div class="team">
        <div class="ti">
            our team
        </div>
        <div class="con">
            <div class="list wow fadeInLeft" data-wow-delay=".2s"">
                <div class="demo">
                    <div class="top">
                        <div class="ima"><img src="./assets/img/2/Vector Smart Object 4.png" alt=""></div>
                        <div class="dz"> <div class="des">
                            <div>Art Director</div>
                            <div>JoN Doe Lorem</div>
                            <div>jondoelorem@dild.com</div>
                            
                        </div>
                        <div class="zhe">
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                        </div></div>
                       
                    </div>
                    <div class="bo">
                        Lorem ipsum dolor sit amet, consectetur adip iscing elitont. Ut ultricies sagittis magna acommo doinger. Ut eget erosoni mauris utcurami susurnand. Vestibulum ante ipsu  primi sini  desiturkarti edolar sitamet deakorna seni cool derrsim de peace biraz doldin
Nulla facilisi. Aliquam elit nisienatis achen oldu bonibkno tranto.
                    </div>
                </div>
                
            </div>
            <div class="list wow fadeInLeft" data-wow-delay=".3s">
                <div class="demo">
                    <div class="top">
                        <div class="ima"><img src="./assets/img/2/Vector Smart Object 4.png" alt=""></div>
                        <div class="dz"> <div class="des">
                            <div>Art Director</div>
                            <div>JoN Doe Lorem</div>
                            <div>jondoelorem@dild.com</div>
                            
                        </div>
                        <div class="zhe">
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                        </div></div>
                       
                    </div>
                    <div class="bo">
                        Lorem ipsum dolor sit amet, consectetur adip iscing elitont. Ut ultricies sagittis magna acommo doinger. Ut eget erosoni mauris utcurami susurnand. Vestibulum ante ipsu  primi sini  desiturkarti edolar sitamet deakorna seni cool derrsim de peace biraz doldin
Nulla facilisi. Aliquam elit nisienatis achen oldu bonibkno tranto.
                    </div>
                </div>
                
            </div>
            <div class="list wow fadeInLeft" data-wow-delay=".4s"">
                <div class="demo">
                    <div class="top">
                        <div class="ima"><img src="./assets/img/2/Vector Smart Object 4.png" alt=""></div>
                        <div class="dz"> <div class="des">
                            <div>Art Director</div>
                            <div>JoN Doe Lorem</div>
                            <div>jondoelorem@dild.com</div>
                            
                        </div>
                        <div class="zhe">
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                        </div></div>
                       
                    </div>
                    <div class="bo">
                        Lorem ipsum dolor sit amet, consectetur adip iscing elitont. Ut ultricies sagittis magna acommo doinger. Ut eget erosoni mauris utcurami susurnand. Vestibulum ante ipsu  primi sini  desiturkarti edolar sitamet deakorna seni cool derrsim de peace biraz doldin
Nulla facilisi. Aliquam elit nisienatis achen oldu bonibkno tranto.
                    </div>
                </div>
                
            </div>
            <div class="list wow fadeInLeft" data-wow-delay=".5s"">
                <div class="demo">
                    <div class="top">
                        <div class="ima"><img src="./assets/img/2/Vector Smart Object 4.png" alt=""></div>
                        <div class="dz"> <div class="des">
                            <div>Art Director</div>
                            <div>JoN Doe Lorem</div>
                            <div>jondoelorem@dild.com</div>
                            
                        </div>
                        <div class="zhe">
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                            <div class="ci"></div>
                        </div></div>
                       
                    </div>
                    <div class="bo">
                        Lorem ipsum dolor sit amet, consectetur adip iscing elitont. Ut ultricies sagittis magna acommo doinger. Ut eget erosoni mauris utcurami susurnand. Vestibulum ante ipsu  primi sini  desiturkarti edolar sitamet deakorna seni cool derrsim de peace biraz doldin
Nulla facilisi. Aliquam elit nisienatis achen oldu bonibkno tranto.
                    </div>
                </div>
                
            </div>
        </div>
    </div>
    <!-- footer -->
    <div class="footer">
        <div class="tw wow fadeInLeft" data-wow-delay=".2s">
            <div class="title">
                Twitter FEEDs
            </div>
            <div class="cen">
                <h1>
                    Check out this great theme item

                    <a href="">http://tadjalskfj.com</a><br>
                    2 weeks ago
                </h1>
                <div class="fg"></div>
                <h1>
                    Check out this great theme item

                    <a href="">http://tadjalskfj.com</a><br>
                    2 weeks ago
                </h1>
                <div class="fg"></div>
                <h1>
                    Check out this great theme item

                    <a href="">http://tadjalskfj.com</a><br>
                    2 weeks ago
                </h1>
            </div>

        </div>
        <div class="new wow fadeInLeft" data-wow-delay=".3s">
            <div class="title">
                NEWSLETTER
            </div>
            <div class="cen">
                <h1>
                    Lorem ipsum dolor sit amet, consectetur adip
                    iscing elit. Ut ultricies sagittis magna a comm.
                    Ut eget eros mauris, ut cursus urna.
                </h1>
                <div class="fg"></div>
            </div>

            <div class="email">
                <div class="top">Your Email Address</div>
                <input type="text">
                <button>Sign Up</button>
            </div>
        </div>
        <div class="rec wow fadeInLeft" data-wow-delay=".4s">
            <div class="title">
                recent projects
            </div>
            <div class="cen">
                <div class="zheng"></div>
                <div class="dis">
                    <h1>
                        Sketchy Business Card
                        <a href="">http://tadjalskfj.com</a><br>
                        2 weeks ago
                    </h1>

                </div>
            </div>
            <div class="fg"></div>
            <div class="cen">
                <div class="zheng"></div>
                <div class="dis">
                    <h1>
                        Sketchy Business Card
                        <a href="">http://tadjalskfj.com</a><br>
                        2 weeks ago
                    </h1>

                </div>
            </div>
            <div class="fg"></div>
            <div class="cen">
                <div class="zheng"></div>
                <div class="dis">
                    <h1>
                        Sketchy Business Card
                        <a href="">http://tadjalskfj.com</a><br>
                        2 weeks ago
                    </h1>

                </div>
            </div>
        </div>
        <div class="con wow fadeInLeft" data-wow-delay=".5s">
            <div class="title">
                Contact
            </div>

            <div class="list">
                <img src="./assets/img/1/5.png" alt="">
                <div class="demo">
                    1 - 000 - 000-0000 <br>
                    1 - 000 - 000-0000
                </div>
            </div>
            <div class="list">
                <img src="./assets/img/1/Shape 54.png" alt="">
                <div class="demo">
                    1 - 000 - 000-0000 <br>
                    1 - 000 - 000-0000
                </div>
            </div>
            <div class="list">
                <img src="./assets/img/1/Shape 53.png" alt="">
                <div class="demo">
                    abcdefg@hijs.dfh <br>
                    fjashfaf@jkfs.ckd
                </div>
            </div>

        </div>
    </div>
</body>

</html>
<script src="./assets/js/jquery.min.js"></script>
<script src="./assets/js/bootstrap.min.js"></script>
<script src="./assets/js/less.min.js"></script>
<script src="./assets/js/wow.min.js"></script>
<script>
    new WOW().init();
</script>